<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ video.host.hostalias }}的录像</title>
    <link rel="stylesheet" href="/static/css/asciinema-player.css">
</head>
<body>
<h1>{{ video.host.hostalias }}的录像 开始时间:{{ video.createtime|date:'Y-m-d H:d:s' }}
    结束时间:{{ video.endtime|date:'Y-m-d H:d:s' }}</h1>
<div>
    快捷键:
    <p>space 空格，播放或暂停</p>
    <p> 全屏播放，可以看到title等设置</p>
    <p>← / → 快进或快退，每次5秒</p>
    <p>0，1，6 ... 9 跳转到录像的0%，10%，60% ... 90%</p>
    <p>< / > 增加或降低播放速度</p>
</div>
<asciinema-player id="video-body"
                  poster="data:text/plain,\x1b[1;32m{{ video.createtime|date:'Y-m-d H:d:s' }}\x1b[1;0m用户\x1b[1;32m{{ video.operator }}\x1b[1;0m连接主机\x1b[1;32m{{ video.host.ip }}:{{ video.host.port }}\x1b[1;0m的录像记录"#}
                  src="/video/{{ video.path }}">
</asciinema-player>
<script src="/static/js/asciinema-player.js"></script>
</body>
</html>